<link rel="stylesheet" href="../static/bootstrap/css/bootstrap.css"
	type="text/css" media="screen" />
<link rel="stylesheet"
	href="../static/bootstrap/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="../static/css/style.css">

<script src="../static/js/jquery-1.9.1.js" type="text/javascript"
	charset="utf-8"></script>
<script src="../static/bootstrap/js/bootstrap.min.js"
	type="text/javascript" charset="utf-8"></script>
<script src="../static/js/ztable.js" type="text/javascript"
	charset="utf-8"></script>

<script>
	$(document).ready(function() {
	
		/*
		function readURL(input) {
			if (input.files && input.files[0]) {
				var reader = new FileReader();

				reader.onload = function(e) {
					$('#image-preview').attr('src', e.target.result);
				}

				reader.readAsDataURL(input.files[0]);
			}
		}

		$("#image-input").change(function() {
			readURL(this);
		});

		$("#image-del-btn").click(function() {
			$("#image-input").files = null;
			$('#image-preview').attr('src', '../static/images/0001/live.jpg');
		});
		*/

		function load_Property($Property){
			//Set value to submit form
			if ($Property != ''){
				$('#property-description').val($Property.attr('description'));
				$('#property-name').val($Property.find('td[name="property-name"]').text());
				$('#price').val($Property.find('td[name="property-price"]').text());
				$('#quantity').val($Property.find('td[name="property-quantity"]').text());
				
				if( $Property.attr('Property_type') == '0')
					$('#property-type').val("Property");
				else
					$('#property-type').val("Service");
				
				id = $Property.find('input[name="select-Property"]').val()
				$('input[name="property-id"]').val(id);
				$('input[name="property-action"]').val('edit-Property');
				
				picture_path = '../' + $Property.attr('picture_path')
				$("#image-preview").attr('src', picture_path);
			}
		}
		
		table = $('#my-properties-table').ZTable({load_callback:load_Property});
		
		/*
		//form = $('#my-properties-form').ZMultiPages({load_callback:load_Property});
		//Click edit button
		$('input[name="edit-Property"]').click(function(){
			$selected = table.getHighlightedRow();
			load_Property($selected);

			$('div.property-form-title > h3').text('Edit Property')
			if ($('#add-property-form').is(':hidden'))
				$('#add-property-form').show(300);
		});
		
		//Click add button
		$('input[name="add-Property"]').click(function(){
			$('input[name="property-action"]').val('add-Property');

			$('div.property-form-title > h3').text('Post new Property')

			if ($('#add-property-form').is(':hidden'))
				$('#add-property-form').show(300);
		});
		
		$('input[name="select-Property"]:checked').click(function(){
			$(this).prop('checked', false);	
		});
				
		$('#add-property-form').hide();
		
		
		pages = $('#my-properties-form').find('.form-page');
		prev = $('#my-properties-form').find('.prev-btn');
		next = $('#my-properties-form').find('.next-btn');
		
		function getActivePage(){
			if(typeof(pages)!='undefined'){
				for(i=0; i<pages.length; i++){
					if (pages[i].is(":visible")){
						return i;
					}
				}
			}
			return null;
		}
		
		prev.click(function(){
			n = getActivePage();
			if (n != null && n>0){
				pages[n].hide();
				pages[n-1].show();
			}
		});

		next.click(function(){
			n = getActivePage();
			if (n != null && n>0){
				pages[n].hide();
				pages[n+1].show();
			}
		});
		*/
		
	});
</script>